<%@ page language="java" contentType="text/html; charset=UTF-8"
		 pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<title>应用服务器详情</title>
    <jsp:include page="common/common_head.jsp"></jsp:include>


</head>
<body  data-spy="scroll" data-target=".navbar">



<jsp:include page="common/common_banner_app.jsp"></jsp:include>
<div style="height:30px"></div>
<div class="container">


    <h4>${appName} ${app}(${version})</h4>
    <div class="progress progress-info progress-striped active">
        <div class="bar" style="width: 1%">100%</div>
    </div>
	<div id="area">

    </div>



	<jsp:include page="common/common_js.jsp"></jsp:include>

    <script type="application/javascript" src="/js/log.js"></script>


    <script>


        var app = '${app}';
        var version = '${version}';
        var slave = '${slave}';

        var appName = '${appName}'

        var id = "area";

        var allStep = 0;
        var executedStep = 0;

        function showProgress(){


            var rate = executedStep * 100.0 / allStep;
            var bar = $(".bar");
            bar.css("width", rate + "%");
            bar.html(rate + "%");

            if(executedStep == allStep){
                console.log("安装结束");
                alert("安装成功!");
                location.href = "/test/detail.html?name=" + appName +"&host=" + slave;
            }
        }
        function createTextArea(parentId){

            var slaveArr = slave.split(",");
            allStep = slaveArr.length * 2
            $.each(slaveArr, function(i, n){

                var hostname = n;
                var name = hostname.replace(/\./g, "");
                $("#" + parentId).append("<div class='well'>"+ hostname + "<textarea style='width:100%;height:100px' id='area_" + name +"'>执行中...</textarea></div>");

            })
        }
        function installDeployFile(){

            console.log("installDeployFile")

            createTextArea("area");

            var data = {<c:forEach items="${params}" var="c">${c.key}:"${c.value}",</c:forEach>abc:""};

            log("appInstallDeployFile.html", data,{

                error: function(){
                    console.log("error")
                    executedStep++;
                    showProgress();
                },
                complete: function(n, config){

                    console.log("complete")

                    executedStep++;
                    showProgress();
                    installDeployConfig(data)
                }
            })
        }

        function installDeployConfig( data){

            console.log("installDeployConfig")

            log("appInstallDeployConfig.html", data,{

                render: function(n, config){
                   // alert(n)

                    var obj = $("#" + config.targetId);
                    obj.html(obj.html() + "\n\n" + n + "\n配置发布完毕")
                },
                complete: function(n, config){

                    console.log("complete" + executedStep)

                    executedStep++;
                    showProgress();
                }
            })
        }


        function log(url, data, config){

            $.ajax({
                url: url,
                data: data == null ? {} : data,
                dataType: "json",
                complete: function(){

                },
                success: function(r){


                    var completeFlag = false
                    $.each(r, function(i, n){

                        if(typeof n.success == "undefined"){

                            if(typeof n.task == "undefined"){

                                if(config.render == null || typeof config.render == "undefined"){

                                    $("#" + config.targetId).html(r[0].message)
                                }else{
                                    config.render(r[0], config)
                                }

                                completeFlag = true;

                            }else{
                                var hostname = n.task.hostName
                                var name = hostname.replace(/\./g, "");
                                var taskId = n.task.taskId;
                                var obj = $("#area_" + name);
                                config.hostName = hostname
                                config.taskId = taskId
                                config.targetId = "area_" + name;
                                showLogByTaskId( config)
                            }

                        }else{
                            var hostname = n.request.hostName
                            var name = hostname.replace(/\./g, "");
                            var obj = $("#area_" + name)
                            obj.html(n.msg)
                            obj.css("border", "1px solid red")
                            if(config.error != null && typeof config.error != "undefined"){
                                config.error()
                            }else if(config.complete != null && typeof config.complete != "undefined"){
                                config.complete()
                            }

                        }



//                        var status = n.success == true ? " 1px solid green": "1px solid red";
//                        if(obj.size() == 0){
//
//                            $("#" + parentId).append("<div class='well' style='" + status + "'>"+ hostname + "<textarea style='width:100%;height:100px' id='area_" + name +"'></textarea></div>");
//                            obj = $("#area_" + name);
//                        }
//                        obj.parent().css("border", status)
//                        obj.html(n.msg);
//
//                        if(elementCallBack != null && typeof elementCallBack != "undefined")
//                            elementCallBack(n)


                    })
                    if(completeFlag && config.complete != null && typeof config.complete != "undefined") {

                        config.complete()
                    }
//
//                    if(requestCallBack != null && typeof requestCallBack != "undefined")
//                        requestCallBack(r)


                }
            })
        }
        $(document).ready(function(){
            installDeployFile()
        })

	</script>

</body>
</html>